import $store from '@/store'
import {
  mapState
} from 'vuex'

export default {
  computed: {
    ...mapState({
      onLockScreen: state => state.$onLockScreen,
      $lockScreenSettings: state => state.$lockScreenSettings
    })
  },
  data() {
    return {
      globalTimer: null
    }
  },
  watch: {
    onLockScreen(newValue, oldValue) {
      if (newValue === true) {
        clearTimeout(this.globalTimer)
      } else {
        this.waitLockScreen()
      }
    },
  },
  methods: {
    // 倒计时 到锁屏的时间之后将锁屏状态设置为true
    waitLockScreen() {
      if (this.$lockScreenSettings?.enabled === true) {
        clearTimeout(this.globalTimer)
        let lockTime = this.$lockScreenSettings?.lockTime
        if (lockTime && typeof lockTime === 'number') {
          lockTime = this.$lockScreenSettings?.lockTime * 1000
          console.log(lockTime, ',lockTime');
          this.globalTimer = setTimeout(() => {
            console.log(this.$lockScreenSettings?.enabled, ',enabled');
            if (this.$lockScreenSettings?.enabled === true) {
              this.$store.commit('SET_LOCK_STATE', true)
              clearTimeout(this.globalTimer)
            }
          }, lockTime)
        }
      }
    },
    clearGlobalTimer() {
      clearTimeout(this.globalTimer)
    },
  },
  created() {
    this.waitLockScreen()
  },
  updated() {
    this.waitLockScreen()
  },
  beforeDestroy() {
    this.clearGlobalTimer()
  },
}
